<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>部门管理</title>
<link rel="stylesheet" type="text/css" href="../res/css/common.css"/>
<link rel="stylesheet" type="text/css" href="../res/easyui1.5.3/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../res/easyui1.5.3/themes/icon.css">
<script type="text/javascript" src="../res/easyui1.5.3/jquery.min.js"></script>
<script type="text/javascript" src="../res/easyui1.5.3/jquery.easyui.min.js"></script>
<script src="../res/easyui1.5.3/locale/easyui-lang-zh_CN.js" type="text/javascript" charset="utf-8"></script>
<script src="../res/easyui1.5.3/easyui-utils.js" type="text/javascript" charset="utf-8"></script>
<script src="../res/js/tools.js" type="text/javascript" charset="utf-8"></script>
<script type="application/javascript">
	$(function(){
		// 初始化添加权限时的下拉树
		$('#pidTree').combotree('loadData',[{"id":0,"text":"[100.00%]总公司","iconCls":"icon-save","children":[{"id":1,"text":"[100.00%]运营中心-90.10%","checked":true,"children":[{"id":2,"text":"[80.89%]会员单位1","children":[{"id":5,"text":"[70.89%]经纪公司1"},{"id":6,"text":"[70.89%]经纪公司2"},{"id":7,"text":"[60.89%]经纪公司3"}]},{"id":3,"text":"[80.89%]会员单位2"},{"id":4,"text":"[80.89%]会员单位3"}]}]}]); 
	});
		
	/**
	 * 打开添加对话框
	 */
	function openAddDialog(){
		$("#updateDialogForm").form("clear");
		openDialog('updateDialog', '添加部门数据');
	}
	
	/**
	 * 打开修改对话框 
	 */
	function openUpdateDialog(){
		var row = getDatagridSelectedRow("datagridTable");
		$("#updateDialogForm").form("load", row);
		openDialog('updateDialog', '修改部门数据');
	}
	
	
	/**
	 * 格式化显示状态
	 * @param {Object} value
	 * @param {Object} row
	 * @param {Object} index
	 */
	function formatterStatus(value,row,index){
		var typeStr = "<span style='color:#FECD51;'>未知状态</span>";
		switch(value){
			case 0:
			typeStr = "<span style='color:green;'>正常</span>";
			break;
			case 1:
			typeStr = "<span style='color:red;'>禁用</span>";
			break;
		}
		return typeStr;
	}
	
	
	
	/**
	 * 格式化显示提成比例
	 * @param {Object} value
	 * @param {Object} row
	 * @param {Object} index
	 */
	function formatterCommissionRate(value,row,index){
		return value.toFixed(2) + "%";
	}
	/**
	 * 提交修改的数据
	 */
	function submitUpdateForm(){
		var obj = $('#updateDialogForm').form("getData", true);
		if($('#updateDialogForm').form("validate")){
			doAjax("../json/success.json", "GET", obj, true, function(result){
				showMsg(result.msg);
				if(result.code == AJAX_HANDLE_SUCCESS){
					closeDialog("updateDialog");
					// 表格数据重新加载
					$("#datagridTable").treegrid("reload");
				}
			});
		}
	}
	
	/**
	 * 提交查询form 
	 */
	function submitQueryForm(){
		var obj = $('#queryForm').form("getData", true);
		doAjax("../json/success2.json", "GET", obj, true, function(result){
			if(result.msg != ""){
				showMsg(result.msg);
			}
			if(result.code == AJAX_HANDLE_SUCCESS){
				// 填充加载到的数据
				$("#datagridTable").treegrid("loadData", result.data);
			}
		});
	}
</script>
</head>
<body>
<!--部门数据表格-->
<table id="datagridTable" class="easyui-treegrid" fit="true"
        data-options="method:'get', 
        url:'../json/departmentList.json',
        fitColumns:false,
        singleSelect:true,
        idField:'id',   
    	    treeField:'name', 
        pagination:true,
        rownumbers:true,
        toolbar:'#datagridTableToolBtns'
      	">  
    <thead>  
        <tr>  
	        	<th data-options="field:'id', checkbox:true, align:'center'">ID</th>
	        <th data-options="field:'name',width:240">名称</th>
	        <th data-options="field:'code',width:100">编号</th>
	        <th data-options="field:'commissionRate',width:80, formatter:formatterCommissionRate">提成比例</th>
	        <th data-options="field:'linkman',width:100">联系人</th>
	        <th data-options="field:'phoneNo',width:100">联系电话</th>
	        <th data-options="field:'pid', hidden:'true'">父类ID</th>
	        <th data-options="field:'level', hidden:'true'">层级</th>
	        <th data-options="field:'remark',width:150">备注</th>
	        <th data-options="field:'seq',width:60">排序</th>
	        <th data-options="field:'status',width:60, formatter:formatterStatus">状态</th>  
	        <th data-options="field:'createTime',width:140">创建时间</th>
	        <th data-options="field:'updateTime',width:140">修改时间</th>
        </tr>  
    </thead>  
</table>


<!--表格工具区域-->
<div id="datagridTableToolBtns">
	<a href="javascript:openAddDialog();" class="easyui-linkbutton" data-options="iconCls:'icon-add'">添加</a>
	<a href="javascript:openUpdateDialog();" class="easyui-linkbutton" data-options="iconCls:'icon-edit'">修改</a>
	<span>|</span>
	<form id="queryForm" class="i-b">
		编号：<input name="code" class="easyui-textbox" />
		名称：<input name="name" class="easyui-textbox" />
		创建日期：<input name="startTime" class="easyui-datetimebox" editable="false"/>到<input name="endTime" class="easyui-datetimebox" editable="false"/>
		<a href="javascript:submitQueryForm();" class="easyui-linkbutton" data-options="iconCls:'icon-search',plain:true">查询</a>
	</form>
</div>
<!-- 工具区域结束 -->

<!-- 添加部门 -->
<div id="updateDialog" class="easyui-dialog" style="width:400px;height:440px; padding:10px;"  
        data-options="iconCls:'icon-save',resizable:true,modal:true, close:true,closed:true, buttons:'#dialogBtns'">  
    <form id="updateDialogForm" class="dialogForm">
		<input type="hidden" name="id" id="id" value="-1" />
		<div class="row">
			<label for="name">上级部门:</label>
			<select id="pidTree" name="pid" class="easyui-combotree" style="width:200px;" data-options="required:true"></select>
		</div>
		<div class="row">
			<label for="name">部门编码:</label>
			<input class="easyui-validatebox" type="text" name="code" data-options="required:true" style="width: 60px;" />
			<span style="color: red;">只能是3位数字</span>
		</div>
		<div class="row">
			<label for="name">部门名称:</label>
			<input class="easyui-validatebox" type="text" name="name" data-options="required:true" />
		</div>
		<div class="row">
			<label for="name">提成比例:</label>
			<input class="easyui-validatebox" type="text" name="commissionRate" data-options="required:true" style="width: 60px;" />
			<span style="color: red;">只能位数字且不能高于上级</span>
		</div>
		<div class="row">
			<label for="name">联系人:</label>
			<input class="easyui-validatebox" type="text" name="linkman" data-options="required:true" />
		</div>
		<div class="row">
			<label for="name">联系电话:</label>
			<input class="easyui-validatebox" type="text" name="phoneNo" data-options="required:true" />
		</div>
		<div class="row">
			<label for="type">部门状态:</label>
			<select id="typeSelectBox" class="easyui-combobox" name="status" data-options="panelHeight:'auto'" style="width:200px;">
				<option value="0">正常</option>
				<option value="1">禁用</option>
			</select>
		</div>
		<div class="row">
			<label for="description" style="vertical-align: top;">备注:</label>
			<textarea name="remark" style="width: 200px; height: 100px;"></textarea>
		</div>
	</form>
</div> 
<div id="dialogBtns" style="text-align: center;">
	<a href="javascript:submitUpdateForm();" class="easyui-linkbutton" style="width: 40px;">提交</a>
</div>
<!-- 添加部门 结束-->
</body>
</html>
